// -----店铺--------
(function(){
    let shoptbox = document.querySelector(".JDshow");

    let xhr = new XMLHttpRequest();
    xhr.open("get","http://chst.vip:1234/api/getgsshop");
    xhr.send();
    xhr.onreadystatechange = function(){
        if(xhr.readyState === 4 && xhr.status === 200){
            let req = JSON.parse(xhr.responseText);
            // console.log(req);
            let reqArr = req.result;
            // console.log(reqArr);
 
            let ele = "";
            reqArr.forEach( item => {

                ele +=  `
                        <li shopid="${item.shopId}">${item.shopName}</li>
                        `
                
            });

            shoptbox.innerHTML = ele;
        }

    }
})();


// ------地区----------
(function(){
    let areatbox = document.querySelector(".HBshow");

    let xhr = new XMLHttpRequest();
    xhr.open("get","http://chst.vip:1234/api/getgsshoparea");
    xhr.send();
    xhr.onreadystatechange = function(){
        if(xhr.readyState === 4 && xhr.status === 200){
            let req = JSON.parse(xhr.responseText);
            // console.log(req);
            let reqArr = req.result;
            // console.log(reqArr);

            let ele = "";
            reqArr.forEach( item => {

                ele +=  `
                        <li areaid="${item.areaId}">${item.areaName}</li>
                        `
                
            });

            areatbox.innerHTML = ele;
        }

    }
})();



// --------点击出现店铺 区域/点击店铺 区域渲染商品页面-----------
(function(){
    let products = document.querySelector(".products");
    let shopid = 0;
    let areaid = 0;

    //店铺
    $('.JD').click(function(){
        $('.JDshow').next().css("display","none").end().slideToggle();
        // console.log($('.JDshow li'));

        $('.JDshow li').click(function(){
            // console.log($(this).attr('shopid'));
            shopid = $(this).attr('shopid');
            document.querySelector('.JD p').innerHTML = this.innerHTML;

            $.ajax({
                url: 'http://chst.vip:1234/api/getgsproduct?shopid='+shopid+"&areaid="+areaid,
                type: 'GET',
                dataType: 'json',
                success(req){
                //    console.log(req);
                   let reqArr = req.result;
                   // console.log(req.result)
       
                   let ele = "";
                   reqArr.forEach( item =>{
                       // console.log(item)
       
                       ele +=  `
                                   <li>
                                       <img src="${item.productImg}" alt="">
                                       <p>${item.productName}</p>
                                       <span>${item.productPrice}</span>
                                   </li>
                               `
                   })

                   products.innerHTML = ele;
                },
            })
        })

    })



    //商品
    $('.HB').click(function(){
        $('.HBshow').prev().css("display","none").end().slideToggle(); 

        $('.HBshow li').click(function(){
            // console.log($(this).attr('areaid'));
            areaid = $(this).attr('areaid');
            document.querySelector('.HB p').innerHTML = this.innerHTML.substr(0,2);

            $.ajax({
                url: 'http://chst.vip:1234/api/getgsproduct?shopid='+shopid+"&areaid="+areaid,
                type: 'GET',
                dataType: 'json',
                success(req){
                //    console.log(req);
                   let reqArr = req.result;
                   // console.log(req.result)
       
                   let ele = "";
                   reqArr.forEach( item =>{
                       // console.log(item)
       
                       ele +=  `
                                   <li>
                                       <img src="${item.productImg}" alt="">
                                       <p>${item.productName}</p>
                                       <span>${item.productPrice}</span>
                                   </li>
                               `
                   })

                   products.innerHTML = ele;
                },
            })
        })
    })


})();


//---------根据默认店铺 区域获取商品----------
(function(){
    let products = document.querySelector(".products");
    let shopid = 0;
    let areaid = 0;

    
    let xhr = new XMLHttpRequest();
    xhr.open("get","http://chst.vip:1234/api/getgsproduct?shopid="+shopid+"&areaid="+areaid);
    xhr.send();
    xhr.onreadystatechange = function(){
        if(xhr.readyState === 4 && xhr.status === 200){
            let req = JSON.parse(xhr.responseText);
            // console.log(req)
            let reqArr = req.result;
            // console.log(req.result)

            let ele = "";
            reqArr.forEach( item =>{
                // console.log(item)

                ele +=  `
                            <li>
                                <img src="${item.productImg}" alt="">
                                <p>${item.productName}</p>
                                <span>${item.productPrice}</span>
                            </li>
                        `
            })

            products.innerHTML = ele;
        }
    }


    $('.gotop').click(function () {
        $('body, html').animate({ scrollTop: 0 }, 1000)
      })
})();



